/**
 * 优化后的iframe通信Hook
 * 基于新的消息系统，提供更好的类型安全和错误处理
 */

import { ref, onMounted, onUnmounted } from 'vue';
import { useRouter } from 'vue-router';
import { iframeMessenger } from '@/utils/iframeMessaging';
import { globalPopupManager } from '@/hooks/usePopupManager';
import { useMapDragOptimization } from '@/hooks/useMapDragOptimization';
import { getWellPoint } from '@/api/Quancheng';
import { getPointInfo } from '@/api/earlyWarning';

export const useOptimizedIframeMessage = (iframeId = 'Thingjsiframe') => {
  const router = useRouter();
  const mapDragOptimization = useMapDragOptimization();

  // 连接状态
  const isConnected = ref(false);
  const connectionError = ref<string | null>(null);

  /**
   * 初始化通信
   */
  const initializeCommunication = () => {
    // 获取iframe元素
    const mapFrame = document.getElementById(iframeId) as HTMLIFrameElement;

    if (mapFrame) {
      iframeMessenger.setIframe(mapFrame);
      // 在生产环境中，应该设置具体的域名
      // iframeMessenger.setOrigin('https://your-thingjs-domain.com');
    } else {
      console.warn('⚠️ 未找到Thingjsiframe iframe元素');
      connectionError.value = '未找到iframe元素';
    }

    // 注册消息处理器
    setupMessageHandlers();
  };

  /**
   * 设置消息处理器
   */
  const setupMessageHandlers = () => {
    // ThingJS加载完成
    iframeMessenger.onMessage('ThingJS加载完成', async (data) => {
      isConnected.value = true;
      connectionError.value = null;

      // 等待一小段时间确保iframe完全准备好，然后发送初始数据
      setTimeout(async () => {
        await sendInitialData();
      }, 1000);
    });

    // 弹窗相关消息
    iframeMessenger.onMessage('显示设备详情', (data) => {
      console.log('🔧 收到显示设备详情消息:', data);

      globalPopupManager.showPopup({
        id: data.id, // 直接使用ThingJS传来的ID
        type: 'device-detail',
        data,
        position: data.position || { x: 0, y: 0 },
        geoPosition: data.geoPosition,
        followMap: data.followMap ?? true,
        zIndex: 1000
      });

      console.log('🔧 设备详情弹窗已创建，开始同步跟踪弹窗');
      // 同步跟踪弹窗列表
      syncFollowMapPopups();
    });

    iframeMessenger.onMessage('显示监测数据', (data) => {
      console.log('🔔 收到显示监测数据消息:', data);
      console.log('🔍 接收到的position:', data.position);
      console.log('🔍 接收到的type:', data.type);

      const popupData = {
        id: data.id, // 直接使用ThingJS传来的ID，确保ID匹配
        type: data.type || 'MONITOR', // 使用动态传递的type
        data,
        position: data.position || { x: 0, y: 0 },
        geoPosition: data.geoPosition,
        followMap: data.followMap ?? true,
        zIndex: 1000
      };

      console.log('🎯 即将创建弹窗数据:', popupData);
      globalPopupManager.showPopup(popupData);

      console.log('🎯 弹窗已创建，开始同步跟踪弹窗');
      syncFollowMapPopups();
    });

    iframeMessenger.onMessage('显示报警信息', (data) => {
      console.log('🚨 收到显示报警信息消息:', data);

      globalPopupManager.showPopup({
        id: data.id, // 直接使用ThingJS传来的ID
        type: 'alarm-info',
        data,
        position: data.position || { x: 0, y: 0 },
        geoPosition: data.geoPosition,
        followMap: data.followMap ?? true,
        zIndex: 1000
      });

      console.log('🚨 报警弹窗已创建，开始同步跟踪弹窗');
      syncFollowMapPopups();
    });

    iframeMessenger.onMessage('关闭弹窗', (data) => {
      if (data.id) {
        globalPopupManager.hidePopup(data.id);
      } else {
        globalPopupManager.hideAllPopups();
      }

      syncFollowMapPopups();
    });

    // 关闭所有弹窗
    iframeMessenger.onMessage('关闭所有弹窗', () => {
      globalPopupManager.hideAllPopups();
      syncFollowMapPopups();
    });

    // 预警信息弹窗
    iframeMessenger.onMessage('显示预警信息', (data) => {
      console.log('⚠️ 收到显示预警信息消息:', data);

      globalPopupManager.showPopup({
        id: data.id, // 直接使用ThingJS传来的ID
        type: 'WARING',
        data,
        position: data.position || { x: 0, y: 0 },
        geoPosition: data.geoPosition,
        followMap: data.followMap ?? true,
        zIndex: 1000
      });

      console.log('⚠️ 预警弹窗已创建，开始同步跟踪弹窗');
      syncFollowMapPopups();
    });

    // 地图拖动优化
    iframeMessenger.onMessage('地图拖动开始', () => {
      mapDragOptimization.startDragOptimization();
    });

    iframeMessenger.onMessage('地图拖动中', (data) => {
      if (data.popupPositions) {
        mapDragOptimization.handleDragUpdate(data.popupPositions, (updates) => globalPopupManager.updateFollowMapPopups(updates));
      }
    });

    iframeMessenger.onMessage('地图拖动结束', () => {
      mapDragOptimization.endDragOptimization();
    });

    iframeMessenger.onMessage('地图缩放', (data) => {
      if (data.popupPositions) {
        mapDragOptimization.handleZoomUpdate(data.popupPositions, (updates) => globalPopupManager.updateFollowMapPopups(updates));
      }
    });

    iframeMessenger.onMessage('批量更新弹窗位置', (data) => {
      console.log('📥 Vue收到位置更新消息:', data);
      if (data.popupPositions) {
        console.log('📍 更新弹窗位置:', data.popupPositions);
        globalPopupManager.updateFollowMapPopups(data.popupPositions);
        console.log('✅ 弹窗位置更新完成');
      } else {
        console.warn('⚠️ 位置更新消息缺少popupPositions数据');
      }
    });

    // 业务相关消息
    iframeMessenger.onMessage('查运行数据', async (data) => {
      try {
        const res = await getPointInfo({ id: data.id, type: 'MONITOR' });
        return res.data; // 返回数据作为响应
      } catch (error) {
        console.error('获取运行数据失败:', error);
        throw error;
      }
    });

    iframeMessenger.onMessage('视频播放', async (data) => {
      try {
        const res = await getPointInfo({ id: data.id, type: 'MONITOR' });
        console.log('视频数据:', res.data);
        return res.data;
      } catch (error) {
        console.error('获取视频数据失败:', error);
        throw error;
      }
    });

    // 导航相关
    iframeMessenger.onMessage('前往辅助决策', () => {
      router.push({ path: '/assistantDecision' });
    });

    iframeMessenger.onMessage('缓存辅助决策', (data) => {
      console.log('缓存辅助决策数据:', data);
      // TODO: 实现数据缓存逻辑
    });
  };

  /**
   * 发送初始数据到ThingJS
   */
  const sendInitialData = async () => {
    try {
      // 检查iframe是否准备好
      const mapFrame = document.getElementById(iframeId) as HTMLIFrameElement;
      if (!mapFrame || !mapFrame.contentWindow) {
        throw new Error('iframe未准备好');
      }

      // 发送管道井数据（使用notify，不需要响应）
      const wellData = await getWellPoint();
      iframeMessenger.notify('管道井', wellData.data);
    } catch (error) {
      console.error('发送初始数据失败:', error);
      connectionError.value = `发送初始数据失败: ${error instanceof Error ? error.message : '未知错误'}`;
    }
  };

  /**
   * 同步需要跟踪的弹窗到ThingJS
   */
  const syncFollowMapPopups = () => {
    const followPopups = globalPopupManager.getFollowMapPopups();
    console.log('📍 获取到需要跟踪的弹窗:', followPopups.length, followPopups);

    const trackingData = followPopups.map((popup) => {
      console.log('🔍 处理弹窗数据:', popup.id, 'position:', popup.position);
      return {
        id: popup.id,
        geoPosition: popup.geoPosition,
        currentPosition: popup.position
      };
    });

    console.log('📤 发送跟踪弹窗数据到ThingJS:', trackingData);

    // 使用节流发送，避免频繁更新
    iframeMessenger.throttledSend('更新跟踪弹窗', trackingData, 16); // 60fps
  };

  /**
   * 显示设备详情
   */
  const showDeviceDetail = async (deviceData: any) => {
    try {
      await iframeMessenger.sendMessage('显示设备详情', deviceData);
    } catch (error) {
      console.error('显示设备详情失败:', error);
    }
  };

  /**
   * 显示监测数据
   */
  const showMonitorData = async (monitorData: any) => {
    try {
      await iframeMessenger.sendMessage('显示监测数据', monitorData);
    } catch (error) {
      console.error('显示监测数据失败:', error);
    }
  };

  /**
   * 显示报警信息
   */
  const showAlarmInfo = async (alarmData: any) => {
    try {
      await iframeMessenger.sendMessage('显示报警信息', alarmData);
    } catch (error) {
      console.error('显示报警信息失败:', error);
    }
  };

  /**
   * 关闭弹窗
   */
  const closePopup = async (popupId?: string) => {
    try {
      await iframeMessenger.sendMessage('关闭弹窗', { id: popupId });
    } catch (error) {
      console.error('关闭弹窗失败:', error);
    }
  };

  /**
   * 获取ThingJS应用信息
   */
  const getThingJSInfo = async () => {
    try {
      const info = await iframeMessenger.sendMessage('获取应用信息');
      return info;
    } catch (error) {
      console.error('获取ThingJS信息失败:', error);
      throw error;
    }
  };

  /**
   * 检查连接状态
   */
  const checkConnection = async () => {
    try {
      await iframeMessenger.sendMessage('ping', null, { timeout: 3000 });
      isConnected.value = true;
      connectionError.value = null;
      return true;
    } catch (error) {
      isConnected.value = false;
      connectionError.value = '连接超时';
      return false;
    }
  };

  /**
   * 批量发送消息（性能优化）
   */
  const batchSendMessages = async (messages: Array<{ method: string; data?: any }>) => {
    try {
      const results = await iframeMessenger.batchSend(messages.map((msg) => ({ ...msg, options: { expectResponse: false } })));
      return results;
    } catch (error) {
      console.error('批量发送消息失败:', error);
      throw error;
    }
  };

  // 生命周期管理
  onMounted(() => {
    // 延迟初始化，等待iframe元素创建
    setTimeout(() => {
      initializeCommunication();
    }, 1000);
  });

  onUnmounted(() => {
    try {
      iframeMessenger.destroy();
      mapDragOptimization.cleanup();
    } catch (error) {
      console.warn('清理iframe通信时出错:', error);
    }
  });

  // 数据清理函数
  const sanitizeMessageData = (data: any): any => {
    if (data === null || data === undefined) {
      return data;
    }

    try {
      // 使用JSON序列化/反序列化来清理数据，移除不可克隆的对象
      return JSON.parse(JSON.stringify(data));
    } catch (error) {
      console.warn('⚠️ 数据序列化失败，使用安全的默认值:', error);

      // 根据数据类型提供安全的默认值
      if (Array.isArray(data)) {
        return [];
      } else if (typeof data === 'object') {
        return {};
      } else {
        return String(data);
      }
    }
  };

  // 创建安全的messenger代理
  const safeMessenger = {
    ...iframeMessenger,
    notify: (method: string, data?: any) => {
      try {
        if (iframeMessenger && typeof iframeMessenger.notify === 'function') {
          // 清理数据确保可以被postMessage传递
          const cleanData = sanitizeMessageData(data);
          iframeMessenger.notify(method, cleanData);
        } else {
          console.warn('⚠️ iframeMessenger未初始化，跳过消息发送:', { method, data });
        }
      } catch (error) {
        console.error('💥 messenger.notify失败:', error, { method, data });

        // 如果是DataCloneError，尝试发送简化数据
        if (error instanceof Error && error.name === 'DataCloneError') {
          console.warn('🔄 检测到DataCloneError，尝试发送简化数据');
          try {
            const fallbackData = typeof data === 'object' ? { simplified: true } : String(data);
            iframeMessenger.notify(method, fallbackData);
          } catch (fallbackError) {
            console.error('💥 发送简化数据也失败:', fallbackError);
          }
        }
      }
    },
    sendMessage: (method: string, data?: any, options?: any) => {
      try {
        if (iframeMessenger && typeof iframeMessenger.sendMessage === 'function') {
          // 清理数据确保可以被postMessage传递
          const cleanData = sanitizeMessageData(data);
          return iframeMessenger.sendMessage(method, cleanData, options);
        } else {
          console.warn('⚠️ iframeMessenger未初始化，跳过消息发送:', { method, data });
          return Promise.reject(new Error('iframeMessenger未初始化'));
        }
      } catch (error) {
        console.error('💥 messenger.sendMessage失败:', error, { method, data });

        // 如果是DataCloneError，尝试发送简化数据
        if (error instanceof Error && error.name === 'DataCloneError') {
          console.warn('🔄 检测到DataCloneError，尝试发送简化数据');
          try {
            const fallbackData = typeof data === 'object' ? { simplified: true } : String(data);
            return iframeMessenger.sendMessage(method, fallbackData, options);
          } catch (fallbackError) {
            console.error('💥 发送简化数据也失败:', fallbackError);
            return Promise.reject(fallbackError);
          }
        }

        return Promise.reject(error);
      }
    }
  };

  return {
    // 状态
    isConnected,
    connectionError,

    // 方法
    showDeviceDetail,
    showMonitorData,
    showAlarmInfo,
    closePopup,
    getThingJSInfo,
    checkConnection,
    batchSendMessages,
    syncFollowMapPopups,

    // 安全的messenger实例
    messenger: safeMessenger
  };
};
